<template>
	<Table ref="tableRef" :columns="data.columns" :toolbar="data.toolbar" :handles="data.handles" :query="data.query"
		@get-list="getData">
	</Table>
</template>

<script lang="ts" setup name="alarmSettingList">
	import { getCity, exportFile } from '@/utils/utils';
	import Table from '@/components/table/index.vue';
	// import { queryDicByParent } from '@/service/apis/api';
	import {
		URL_ALARMORDER,
		getAlarmOrder,
		EXPORT_ALARMORDER
	} from '@/service/apis/alarm';
	import moment from 'moment';

	const router = useRouter();

	const tableRef = ref();

	const emit = defineEmits(['get-update']);
	onActivated(() => {
		emit('get-update', (flag : boolean) => {
			if (flag) {
				tableRef.value?.getData();
			}
		});
	});

	// 获取省市
	getCity().then((res : any) => {
		data.query[7].props.options = [...res];
	});

	const data = reactive({
		pickDate: null as any,
		columns: [
			{
				prop: 'stationName',
				label: '电站名称',
			},
			{
				prop: 'connectorCode',
				label: '终端编码',
			},
			// {
			// 	prop: 'stationAddress',
			// 	label: '电站地址',
			// },
			{
				prop: 'stopReason',
				label: '停止码',
			},
			{
				prop: 'stopMsg',
				label: '停止原因',
			},
			{
				prop: 'stopCount',
				label: '连续停止次数',
			},
			{
				prop: 'alarmTime',
				label: '报警时间',
			},
			{
				prop: 'updateTime',
				label: '更新时间',
			},
			{
				prop: 'alarmStatus',
				label: '报警状态',
				template: (row : any) => {
					return row.alarmStatus == 0 ? '报警' : '恢复';
				},
			},
			{
				prop: 'endTime',
				label: '恢复时间',
			},
		],
		toolbar: [
			{
				label: '导出',
				permission: 'alarmNotificationRecordList.export',
				icon: 'icon-export',
				type: 'primary',
				plain: true,
				handle: (row : any) => {
					// const startData = tableRef?.value.getForm().alarmTimeBegin;
					// const startData1 = tableRef?.value.getForm().alarmTimeEnd;
					// const day = moment(startData1).diff(moment(startData), 'day');
					// console.log('s时间======', tableRef.value?.getForm())
					// console.log('----', startData, day)
					if ((tableRef?.value.getForm().alarmTimeBegin && tableRef?.value.getForm().alarmTimeEnd) || (tableRef?.value.getForm().updateTimeBegin && tableRef?.value.getForm().updateTimeEnd) || (tableRef?.value.getForm().endTimeBegin && tableRef?.value.getForm().endTimeEnd)) {
						exportFile(
							EXPORT_ALARMORDER,
							'连续停充报警表',
							tableRef.value?.getForm()
						);
					} else {
						ElMessageBox.alert(
							'单次导出最多支持导出周期为2个月的数据，请按时间筛选导出对象后再导出。',
							'提示',
							{
								confirmButtonText: '确认',
								type: 'warning',
							}
						);
					}
				},
			},
		],
		query: [
			{
				label: '电站名称',
				prop: 'stationName',
				comName: 'input',
				props: {
					placeholder: '请输入电站名称',
				},
			},
			{
				label: '终端编码',
				prop: 'connectorCode',
				comName: 'input',
				props: {
					placeholder: '请输入终端编码',
				},

			},
			{
				label: '停止码',
				prop: 'stopReason',
				comName: 'input',
				props: {
					placeholder: '请输入停止码',
				},

			},
			{
				label: '报警状态',
				prop: 'alarmStatus',
				comName: 'select',
				props: {
					placeholder: '请选择报警状态',
					options: [
						{ label: "报警", type: "alarmStatus", value: "0" },
						{ label: "恢复", type: "alarmStatus", value: "1" }] as any,
				},

			},
			{
				label: '报警时间',
				prop: 'alarmData',
				comName: 'date',
				keys: ['alarmTimeBegin', 'alarmTimeEnd'],
				props: {
					type: 'daterange',
					calendarChange: (pick : any) => {
						let hasSelectDate = pick !== null && pick.length > 0;
						data.pickDate = hasSelectDate ? pick[0] : null;
					},
					change: (time : any) => {
						if (!time) {
							data.pickDate = null;
						}
					},
					disabledDate: (time : any) : any => {
						if (data.pickDate) {
							const checkTime = data.pickDate.getTime();
							const startTime = checkTime - 62 * 86400 * 1000; // 前面限制62天
							const endTime = checkTime + 62 * 86400 * 1000; // 后面限制62天
							return time.getTime() > endTime || time.getTime() < startTime;
						} else {
							return false;
						}
					},
				},
			},
			{
				label: '更新时间',
				prop: 'updateData',
				comName: 'date',
				keys: ['updateTimeBegin', 'updateTimeEnd'],
				props: {
					type: 'daterange',
					calendarChange: (pick : any) => {
						let hasSelectDate = pick !== null && pick.length > 0;
						data.pickDate = hasSelectDate ? pick[0] : null;
					},
					change: (time : any) => {
						if (!time) {
							data.pickDate = null;
						}
					},
					disabledDate: (time : any) : any => {
						if (data.pickDate) {
							const checkTime = data.pickDate.getTime();
							const startTime = checkTime - 62 * 86400 * 1000; // 前面限制62天
							const endTime = checkTime + 62 * 86400 * 1000; // 后面限制62天
							return time.getTime() > endTime || time.getTime() < startTime;
						} else {
							return false;
						}
					},
				},
			},
			{
				label: '恢复时间',
				prop: 'recoverData',
				comName: 'date',
				keys: ['endTimeBegin', 'endTimeEnd'],
				props: {
					type: 'daterange',
					calendarChange: (pick : any) => {
						let hasSelectDate = pick !== null && pick.length > 0;
						data.pickDate = hasSelectDate ? pick[0] : null;
					},
					change: (time : any) => {
						if (!time) {
							data.pickDate = null;
						}
					},
					disabledDate: (time : any) : any => {
						if (data.pickDate) {
							const checkTime = data.pickDate.getTime();
							const startTime = checkTime - 62 * 86400 * 1000; // 前面限制62天
							const endTime = checkTime + 62 * 86400 * 1000; // 后面限制62天
							return time.getTime() > endTime || time.getTime() < startTime;
						} else {
							return false;
						}
					},
				},
			},
			{
				label: '电桩城市',
				prop: 'citys',
				comName: 'cascader',
				props: {
					placeholder: '请选择电桩城市',
					options: [] as any,
				},
			},
		],
		handles: [
			{
				label: '查看订单',
				permission: 'alarmSettingList.see',
				handle: (row : any) => {
					router.push({
						name: 'alarmOrderDetail',
						query: {
							connectorCode: row.connectorCode
						},
					});
				},
			},
		],
	});

	// 字典
	// queryDicByParent({
	// 	listDtos: ['AlarmSettingType'],
	// }).then((res : any) => {
	// 	if (res) {
	// 		data.query[1].props.options = [...res.AlarmSettingType];
	// 		data.columns[1].dic = [...res.AlarmSettingType];
	// 	}
	// });

	const getData = (page : any, search : any) => {
		const form = search.ruleForm;
		delete form.provinceCode;
		if (form.citys?.length > 0) {
			form.connectorCode = form.citys[1].substring(0, 4);
		}
		if (form.alarmData?.length > 0) {
			form.alarmTimeBegin = form.alarmData[0];
			form.alarmTimeEnd = form.alarmData[1];
		}
		if (form.updateData?.length > 0) {
			form.updateTimeBegin = form.updateData[0];
			form.updateTimeEnd = form.updateData[1];
		}
		if (form.recoverData?.length > 0) {
			form.endTimeBegin = form.recoverData[0];
			form.endTimeEnd = form.recoverData[1];
		}
		getAlarmOrder(form, page).then((res : any) => {
			if (res) {
				if (page.pageNo !== 1 && (!res.dataList || res.dataList?.length === 0)) {
					page.pageNo--;
					getData(page, search);
					return;
				}
				nextTick(() => {
					tableRef.value?.setTable({
						total: res.totalCount,
						table: res.dataList,
					});
				});
			}
		});
	};
</script>